<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>javascript 阶段</title>
    <style>
        div {
            position: absolute;
        }
    </style>
</head>

<body>
    <!-- <div style="background-color: blue;position: absolute;"></div> -->

    <script>
        function createPaintObj() {
            var obj = {};
            obj.x = 100;
            obj.y = 50;
            obj.width = 200;
            obj.height = 120;
            obj.color = "blue";
            obj.drawRect = function () {
                //    var str = "";
                //    str +='<div style="background-color:'+this.color+';position:absolute;left:'+obj.left+'px;top:'+ob.y+'px;width:'+obj.weight+'px;height:'+obj.height+'px;"></div>'
                // var str = "<div style='background-color:"+this.color+"; width:"+this.width+"px; height:"+this.height+";'></div>";
                // var str = "<div style='left:" + this.x + "px;top:" + this.y + "px;width:" + this.width + "px;height:" + this.height + "px;background:" + this.color + ";'></div>";
                var str = "<div style='left:" + obj.x + "px;top:" + obj.y + "px;width:" + obj.width + "px;height:" + obj.height + "px;background:" + obj.color + ";'></div>";
                document.write(str);
                // return str ;
            }
            return obj.drawRect();
        }

        var paint = createPaintObj();
        console.log(paint);
        // paint.drawRect();
    </script>
</body>

</html>